<template>
	<view class="content">
		<custom-header :title="title"></custom-header>
		<view class="text_area">
			<view class="header_tabs" style="padding: 0 1rem">
				<u-tabs :list="list" @click="getIndex" lineColor="#99DAE0" itemStyle="height:100rpx;" :activeStyle="{
            color: 'rgb(41,64,58)',
            fontWeight: 'bold',
            transform: 'scale(1.3)'
        }" :inactiveStyle="{
            color: '#606266',
            transform: 'scale(1.15)',
        }"></u-tabs>
			</view>
			<view class="steps" v-for="(item,index) in list">
				<view v-if="indexShow == index" class="hs-strep">
					<Steps :getIndex="indexShow" />
				</view>
			</view>
		</view>
		<custom-tabbar></custom-tabbar>
	</view>
</template>
<script>
	import Steps from '../../components/steps.vue';
	import {
		scheduleList
	} from "../../api/fan/index.js"
	export default {
		components: {
			Steps
		},
		data() {
			return {
				indexShow: 0,
				list: [],
				id: 1,
				title: '会议日程'
			};
		},
		watch: {
			$route(to, from) {
				let store = this.$store
				switch (to.path) {
					case '/':
						store.commit('sen/checkInde', 0)
						break;
					// case '/pages/gather/gather':
					// 	store.commit('sen/checkInde', 0)
					// 	break;
					case '/pages/personnel/personnel':
						store.commit('sen/checkInde', 1)
						break;
					case '/pages/stay/stay':
						store.commit('sen/checkInde', 2)
						break;
					case '/pages/Inspection/Inspection':
						store.commit('sen/checkInde', 3)
						break;
					case '/pages/material/material':
						store.commit('sen/checkInde', 4)
						break;
				}
			}
		},
		onLoad(op) {
			if (op.id) {
				uni.setStorageSync('id', op.id)
				this.id = op.id
			} else {
				let id = uni.getStorageSync("id")
				if (id) {
					this.id = id
				} else {
					this.id = 1;
					uni.setStorageSync('id', 1)
				}
			}
			this.scheduleLists(this.id)
			// this.scheduleLists(this.indexShow)
		},
		methods: {
			scheduleLists(id) {
				let that = this
				scheduleList(id).then(res => {
					// console.log(id)
					// console.log(res.data.data, 22222222222)
					this.title = res.data.data.title
					that.list = res.data.data.schedule.class_name
					// uni.setStorageSync("content", res.data.data.content)
					// uni.setStorageSync("file_url", res.data.data.file_url)
				})
			},
			getIndex(e) {
				// console.log(e.index);
				this.indexShow = e.index;
				// console.log(this.indexShow)
			}
		}
	};
</script>

<style scoped lang="scss">
	.hs-strep {
		border-radius: 0 0 30rpx 30rpx;
		overflow: hidden;
	}

	.steps {
		background-color: rgba(255, 255, 255, 0.4) !important;
		border-radius: 30rpx;

		view,
		text {
			background-color: rgba(255, 255, 255, 0.4) !important;
		}
	}

	.any_bg {
		position: fixed;
		z-index: 999;
		width: 100%;
		transform: scale(3);
		bottom: 100upx;
	}

	.bgW {
		width: 100vw;
		height: 200rpx;
		background-color: white;
		position: fixed;
		bottom: 0;
		right: 0;
	}

	page {
		background-color: #f5fffe;
		padding-bottom: 250upx;
		background: url(../../static/index/Group.png) no-repeat;
		background-attachment: fixed;
		background-position: -180upx 450upx;
		
	}

	.content {
		margin-top: 120rpx;
	}

	.text_area {
		padding: 0 0.5rem;
		border-radius: 30rpx !important;
		overflow: hidden;

		.steps {
			background-color: white;
		}
	}

	.header_tabs {
		height: 120rpx;
		border-radius: 30rpx 30rpx 0 0;
		overflow: hidden;
		// padding-top: 10px !important;
		width: 100%;
		background-color: white;
		position: static;
		top: 100upx;
		z-index: 999;
		// padding-bottom: 1rem;
	}

	/deep/ .u-steps-item__line {
		background: #99dae0;
	}
</style>